<template>
  <div style="background-color: white;width: 100%;height: 100%;">
      <el-button link @click="router.push('/ProducManagement/SuppliersQuery')" style="margin-left: 10px;">‹返回</el-button>
      &nbsp;
      <span>|</span>
      &nbsp;
      <span style="font-size: 17px;font-weight: 500; color: green;" >供应商基本信息</span>
      <hr style='background-color:#d3d3d3; height:1px; border:none;'>
      <h3 style="font-size: 15px;font-weight: 700; margin-left: 50px; margin-top: 20px;">标准信息</h3>
      <table  class="demo-ruleForm" :model="form" ref="formRef" label-width="auto" style="max-width: 1000px;margin-left: 180px;margin-top: 20px;">
        <tr>
          <td>
            <el-form-item label="供应商编码"  style="margin: 25px;" prop="resourceNo">
              <el-input v-model="form.suppliersNo"  style="width: 200px;" disabled></el-input>
            </el-form-item>
          </td>
          <td>
            <el-form-item label="供应商名称" style="margin: 25px;" prop="suppliersName" :rules="[ { required: true, message: '必填' },]">
              <el-input v-model="form.suppliersName" style="width: 200px;"></el-input></el-form-item>
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="供应商区分" style="margin: 25px;" prop="suppliersType" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.suppliersType" placeholder="请选择">
              <el-option label="公司" value="公司" />
              <el-option label="个人" value="个人" />
              </el-select>
            </el-form-item>
          </td>
          <td>
            <el-form-item label="供应商电话" style="margin: 25px;" prop="suppliersPhone" >
              <el-input v-model="form.suppliersPhone"  style="width: 200px;"></el-input></el-form-item>
          </td>
        </tr>
        <tr>
          <td colspan="2">
            <el-form-item label="供应商地址" style="margin: 25px;" prop="suppliersAdder">
              <el-input v-model="form.suppliersAdder"  style="width: 550px;"></el-input>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="所在国家" style="margin: 25px;" prop="countryId" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.countryId" placeholder="请选择">
              <el-option label="中国" :value="1" />
              </el-select>
            </el-form-item>
          </td>
          <td>
            <el-form-item label="所在城市" style="margin: 25px;" prop="cityId" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.cityId" placeholder="请选择">
                <el-option label="北京" :value="1" />
                <el-option label="天津" :value="2" />
                <el-option label="上海" :value="3" />
                <el-option label="广州" :value="4" />
                <el-option label="深圳" :value="5" />
                <el-option label="珠海" :value="6" />
                <el-option label="石家庄" :value="7" />
                <el-option label="苏州" :value="8" />
                <el-option label="杭州" :value="9" />
                <el-option label="南京" :value="10" />
                <el-option label="青岛" :value="11" />
                <el-option label="重庆" :value="12" />
                <el-option label="长沙" :value="13" />
                <el-option label="西安" :value="14" />
                <el-option label="成都" :value="15" />
              </el-select>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="供应商分类" style="margin: 25px;" prop="supplierClassification" >
              <el-select v-model="form.supplierClassification" placeholder="请选择">
              <el-option label="普通客户" value="普通客户" />
              <el-option label="VIP客户" value="VIP客户" />
              </el-select>
            </el-form-item>
          </td>
          <td>
            <el-form-item label="供应商标签" style="margin: 25px;" prop="supplierLabels" >
              <el-input v-model="form.supplierLabels" style="width: 200px;"></el-input></el-form-item>
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="本公司标识" style="margin: 25px;" prop="companyLogo" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.companyLogo" placeholder="请选择">
              <el-option label="是" value="是" />
              <el-option label="否" value="否" />
              </el-select>
            </el-form-item>
          </td>
          <td>
            <el-form-item label="委外标识" style="margin: 25px;" prop="outsideLabel" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.outsideLabel" placeholder="请选择">
              <el-option label="是" :value="1" />
              <el-option label="否" :value="2" />
              </el-select>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td>
            <el-form-item label="状态" style="margin: 25px;" prop="suppliersStatus" :rules="[ { required: true, message: '必填' },]">
              <el-select v-model="form.suppliersStatus" placeholder="请选择">
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
            </el-select>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td  colspan="2">
            <el-button type="success" @click="UpdateSuppliers">保存</el-button>
          </td>
        </tr>
      </table>
    
      <h2 style="font-size: 17px;font-weight: 500; color: #409EFF; margin-top: 60px; margin-left: 50px; margin-bottom: 10px;" >供应商其他信息</h2>
        <hr style='background-color:#d3d3d3; height:1px; border:none;'>
        <!-- 根据供应商区分 如果是公司显示营业执照 -->
    <el-tabs type="border-card" style="margin-top: 30px;margin-left: 30px" v-show="form.suppliersType == '公司'|| form.suppliersType == ''">
      <!-- 营业执照 -->
      <el-tab-pane v-show="form.suppliersType == '公司'|| form.suppliersType == ''" label="营业执照" >
        <div style="background-color: white;width: 100%;height: 200%;">
    <el-form
    ref="ruleFormRef"
    style="max-width: 600px;margin-left: 180px;margin-top: 20px;"
    :model="ruleForm"
    :rules="rules"
    label-width="auto"
    class="demo-ruleForm"
    :size="formSize"
    status-icon
  >
    <el-form-item label="营业执照号:" prop="businessLicenseNo">
      <el-input v-model="ruleForm.businessLicenseNo" />
    </el-form-item>
    <el-form-item label="法人代表:" prop="representative">
      <el-input v-model="ruleForm.representative" />
    </el-form-item>
    <el-form-item label="公司类型:" prop="enterpriseTypeId">
      <el-select v-model="ruleForm.enterpriseTypeId" placeholder="请选择">
        <el-option label="有限负责公司" :value="1" />
        <el-option label="股份有限负责公司" :value="2" />
        <el-option label="个人独资企业" :value="3" />
        <el-option label="合伙企业" :value="4" />
      </el-select>
    </el-form-item>
    <el-form-item label="经营范围:" prop="businessLicensesRange">
      <el-input v-model="ruleForm.businessLicensesRange" />
    </el-form-item>
    <el-form-item label="成立时间:" prop="businessLicensesDate">
      <el-date-picker
        v-model="ruleForm.businessLicensesDate"
        type="date"
        placeholder="请选择成立日期"
        format="YYYY-MM-DD"
        value-format="YYYY-MM-DD"
      />
    </el-form-item>
    <el-form-item label="状态:" prop="businessLicensesStateser">
      <el-select v-model="ruleForm.businessLicensesStateser" placeholder="请选择">
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
            </el-select>
    </el-form-item>
    <el-form-item>
      <!-- <el-button type="success" @click="AddBusinessLicense()">
        保存
      </el-button> -->
    </el-form-item>
  </el-form> 
  </div>
      </el-tab-pane>
      <!-- 联系人的信息 -->
      <el-tab-pane label="联系人">
        <div class="demo-collapse">
          <el-collapse accordion> </el-collapse>
        </div>
        <div style="background-color: white; width: 100%; height: 100%">

          <div style="margin: 20px">
            <el-table :data="AddContactPersonList" style="width: 100%">
              <el-table-column prop="contactPersonsId" label="序号" />
              <el-table-column prop="contactPersonsName" label="联系人" />
              <el-table-column prop="contactPersonsTell" label=" 联系电话" />
              <el-table-column prop="position" label="联系人岗位" />
              <el-table-column prop="handleTime" label="创建时间" width="180">
                <template #default="{ row }">
                  {{ moment(row.handleTime).format("YYYY-MM-DD HH:mm:ss") }}
                </template>
              </el-table-column>
              <el-table-column prop="handle" label="创建人" width="180" />
              <el-table-column
                prop="contactPersonStatus"
                label="状态"
                width="180"
              >
                <template #default="{ row }">
                  <el-text v-if="row.contactPersonStatus == 1" type="primary"
                    >有效</el-text
                  >
                  <el-text v-else type="danger">无效</el-text>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="180">
                <template #default="scope">
                  <el-button
                    size="small"
                    @click="Fan(scope.row.contactPersonsId)"
                    >编辑</el-button
                  >
                  <el-button
                    size="small"
                    @click="ContactPersonDel(scope.row.contactPersonsId)"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <!-- 修改 -->
        <el-dialog v-model="dialogFormVisible1" title="联系人修改" width="500">
          <el-form
            ref="ruleFormRef"
            style="max-width: 600px"
            :model="ruleForm"
            :rules="rules"
            label-width="auto"
            class="demo-ruleForm"
            :size="formSize"
            status-icon
          >
            <el-form-item label="联系人" prop="contactPersonsName">
              <el-input v-model="ruleForm.contactPersonsName" />
            </el-form-item>
            <el-form-item label="联系电话" prop="contactPersonsTell">
              <el-input v-model="ruleForm.contactPersonsTell" />
            </el-form-item>
            <el-form-item label="联系人岗位" prop="position">
              <el-input v-model="ruleForm.position" />
            </el-form-item>
            <el-form-item label="状态" prop="contactPersonStatus">
              <el-select
                v-model="ruleForm.contactPersonStatus"
                placeholder="请选择"
              >
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
              </el-select>
            </el-form-item>
          </el-form>
          <template #footer>
            <div class="dialog-footer">
              <el-button @click="dialogFormVisible1 = false">取消</el-button>
              <el-button type="primary" @click="UpdateContactPerson">
                确定
              </el-button>
            </div>
          </template>
        </el-dialog>
      </el-tab-pane>
      <!-- 银行信息 -->
      <el-tab-pane label="银行信息">
        <div style="background-color: white;width: 100%;height: 100%;">
   
   
   <div style="margin: 20px;">
     <el-table :data="BankAddList" style="width: 100%">
<el-table-column prop="banksId" label="序号" />
<el-table-column prop="banksNo" label="银行编码"/>
<el-table-column prop="branchNo" label=" 分行编码" />
<el-table-column prop="banksAccount" label="银行账户"/>
<el-table-column prop="handleTime" label="创建时间" width="180">
 <template #default="{row}">
   {{ moment(row.handleTime).format("YYYY-MM-DD HH:mm:ss") }}
 </template>
</el-table-column>
<el-table-column prop="handle" label="创建人" width="180" />
<el-table-column prop="bankStatus" label="状态" width="180">
 <template #default="{row}">
  <el-text v-if="row.bankStatus==1" type="primary">有效</el-text>
  <el-text v-else type="danger">无效</el-text>
 </template>
</el-table-column>
<el-table-column label="操作" width="180" >
                <template #default="scope">
                    <el-button  size="small" @click="BankFan(scope.row.banksId)">编辑</el-button>
                    <el-button  size="small" @click="BankDel(scope.row.banksId)">删除</el-button>
                </template>
            </el-table-column>
</el-table>

   </div>
 
 </div>

   <!--修改-->
 <el-dialog v-model="dialogFormVisible3" title="银行编辑" width="500">
    <el-form
    ref="ruleFormRef"
    style="max-width: 600px"
    :model="ruleForm"
    :rules="rules"
    label-width="auto"
    class="demo-ruleForm"
    :size="formSize"
    status-icon
  >
    <el-form-item label="银行编码" prop="banksNo">
      <el-select v-model="ruleForm.banksNo" placeholder="请选择">
                <el-option label="中国交通银行" value="中国交通银行" />
                <el-option label="交通银行" value="交通银行" />
                <el-option label="中国银行" value="中国银行" />
                <el-option label="中国建设银行" value="中国建设银行" />
                <el-option label="中信银行" value="中信银行" />
                <el-option label="招商银行" value="招商银行" />
                <el-option label="中国工商银行" value="中国工商银行" />

            </el-select>
    </el-form-item>
    <el-form-item label="分行编码" prop="branchNo">
      <el-input v-model="ruleForm.branchNo" />
    </el-form-item>
    <el-form-item label="银行账户" prop="banksAccount">
      <el-input v-model="ruleForm.banksAccount" />
    </el-form-item>
    <el-form-item label="状态" prop="bankStatus">
      <el-select v-model="ruleForm.bankStatus" placeholder="请选择">
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
            </el-select>
    </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogFormVisible3 = false">返回</el-button>
        <el-button type="primary" @click="UpdateBank">
          确定
        </el-button>
      </div>
    </template>
  </el-dialog>
      </el-tab-pane>
    </el-tabs>
    <!-- 如果是个人不显示营业执照 -->
    <el-tabs type="border-card" style="margin-top: 30px;margin-left: 30px" v-show="form.suppliersType == '个人'">
      <!-- 联系人的信息 -->
      <el-tab-pane label="联系人">
        <div class="demo-collapse">
          <el-collapse accordion> </el-collapse>
        </div>
        <div style="background-color: white; width: 100%; height: 100%">

          <div style="margin: 20px">
            <el-table :data="AddContactPersonList" style="width: 100%">
              <el-table-column prop="contactPersonsId" label="序号" />
              <el-table-column prop="contactPersonsName" label="联系人" />
              <el-table-column prop="contactPersonsTell" label=" 联系电话" />
              <el-table-column prop="position" label="联系人岗位" />
              <el-table-column prop="handleTime" label="创建时间" width="180">
                <template #default="{ row }">
                  {{ moment(row.handleTime).format("YYYY-MM-DD HH:mm:ss") }}
                </template>
              </el-table-column>
              <el-table-column prop="handle" label="创建人" width="180" />
              <el-table-column
                prop="contactPersonStatus"
                label="状态"
                width="180"
              >
                <template #default="{ row }">
                  <el-text v-if="row.contactPersonStatus == 1" type="primary"
                    >有效</el-text
                  >
                  <el-text v-else type="danger">无效</el-text>
                </template>
              </el-table-column>
              <el-table-column label="操作" width="180">
                <template #default="scope">
                  <el-button
                    size="small"
                    @click="Fan(scope.row.contactPersonsId)"
                    >编辑</el-button
                  >
                  <el-button
                    size="small"
                    @click="ContactPersonDel(scope.row.contactPersonsId)"
                    >删除</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <!-- 修改 -->
        <el-dialog v-model="dialogFormVisible1" title="联系人修改" width="500">
          <el-form
            ref="ruleFormRef"
            style="max-width: 600px"
            :model="ruleForm"
            :rules="rules"
            label-width="auto"
            class="demo-ruleForm"
            :size="formSize"
            status-icon
          >
            <el-form-item label="联系人" prop="contactPersonsName">
              <el-input v-model="ruleForm.contactPersonsName" />
            </el-form-item>
            <el-form-item label="联系电话" prop="contactPersonsTell">
              <el-input v-model="ruleForm.contactPersonsTell" />
            </el-form-item>
            <el-form-item label="联系人岗位" prop="position">
              <el-input v-model="ruleForm.position" />
            </el-form-item>
            <el-form-item label="状态" prop="contactPersonStatus">
              <el-select
                v-model="ruleForm.contactPersonStatus"
                placeholder="请选择"
              >
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
              </el-select>
            </el-form-item>
          </el-form>
          <template #footer>
            <div class="dialog-footer">
              <el-button @click="dialogFormVisible1 = false">取消</el-button>
              <el-button type="primary" @click="UpdateContactPerson">
                确定
              </el-button>
            </div>
          </template>
        </el-dialog>
      </el-tab-pane>
      <!-- 银行信息 -->
      <el-tab-pane label="银行信息">
        <div style="background-color: white;width: 100%;height: 100%;">
   
   
   <div style="margin: 20px;">
     <el-table :data="BankAddList" style="width: 100%">
<el-table-column prop="banksId" label="序号" />
<el-table-column prop="banksNo" label="银行编码"/>
<el-table-column prop="branchNo" label=" 分行编码" />
<el-table-column prop="banksAccount" label="银行账户"/>
<el-table-column prop="handleTime" label="创建时间" width="180">
 <template #default="{row}">
   {{ moment(row.handleTime).format("YYYY-MM-DD HH:mm:ss") }}
 </template>
</el-table-column>
<el-table-column prop="handle" label="创建人" width="180" />
<el-table-column prop="bankStatus" label="状态" width="180">
 <template #default="{row}">
  <el-text v-if="row.bankStatus==1" type="primary">有效</el-text>
  <el-text v-else type="danger">无效</el-text>
 </template>
</el-table-column>
<el-table-column label="操作" width="180" >
                <template #default="scope">
                    <el-button  size="small" @click="BankFan(scope.row.banksId)">编辑</el-button>
                    <el-button  size="small" @click="BankDel(scope.row.banksId)">删除</el-button>
                </template>
            </el-table-column>
</el-table>

   </div>
 
 </div>

   <!--修改-->
 <el-dialog v-model="dialogFormVisible3" title="银行编辑" width="500">
    <el-form
    ref="ruleFormRef"
    style="max-width: 600px"
    :model="ruleForm"
    :rules="rules"
    label-width="auto"
    class="demo-ruleForm"
    :size="formSize"
    status-icon
  >
    <el-form-item label="银行编码" prop="banksNo">
      <el-select v-model="ruleForm.banksNo" placeholder="请选择">
                <el-option label="中国交通银行" value="中国交通银行" />
                <el-option label="交通银行" value="交通银行" />
                <el-option label="中国银行" value="中国银行" />
                <el-option label="中国建设银行" value="中国建设银行" />
                <el-option label="中信银行" value="中信银行" />
                <el-option label="招商银行" value="招商银行" />
                <el-option label="中国工商银行" value="中国工商银行" />

            </el-select>
    </el-form-item>
    <el-form-item label="分行编码" prop="branchNo">
      <el-input v-model="ruleForm.branchNo" />
    </el-form-item>
    <el-form-item label="银行账户" prop="banksAccount">
      <el-input v-model="ruleForm.banksAccount" />
    </el-form-item>
    <el-form-item label="状态" prop="bankStatus">
      <el-select v-model="ruleForm.bankStatus" placeholder="请选择">
                <el-option label="有效" :value="1" />
                <el-option label="无效" :value="2" />
            </el-select>
    </el-form-item>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogFormVisible3 = false">返回</el-button>
        <el-button type="primary" @click="UpdateBank">
          确定
        </el-button>
      </div>
    </template>
  </el-dialog>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script lang="ts" setup>
import { ref,reactive,onMounted } from 'vue'
import  { ElMessage, ElMessageBox } from 'element-plus'
import axios from 'axios';
const formRef = ref<FormInstance>();
  const apiurl = import.meta.env.VITE_APP_API_URL_ProductionAdd;
  const apiurl1 = import.meta.env.VITE_APP_API_URL_ProductionShow;
  import {useRouter,useRoute} from 'vue-router'
const router = useRouter()
const route = useRoute()
const dialogFormVisible1 = ref(false);
const dialogFormVisible3 = ref(false);
import type { ComponentSize, FormInstance, FormRules } from "element-plus";
import moment from "moment";
//字段
interface RuleForm {
 suppliersId:number
  //营业执照信息字段
  businessLicenseId: number
  businessLicenseNo: string
  representative: string;
  enterpriseTypeId:string
  businessLicensesRange: string;
  businessLicensesDate:string;
  businessLicensesStateser:string;
  //联系人信息字段
  contactPersonsId: number;
  contactPersonsName: string;
  contactPersonsTell: string;
  position: string;
  contactPersonStatus: string;
  //银行信息字段
  banksId: number,
  banksNo: string
  branchNo: string
  banksAccount: string
  bankStatus: string
}

const formSize = ref<ComponentSize>("default");
const ruleFormRef = ref<FormInstance>();
const ruleForm = reactive<RuleForm>({
  suppliersId:0,
  //营业执照信息字段
  businessLicenseId: 0,
  businessLicenseNo: '',
  representative: '',
  enterpriseTypeId:'',
  businessLicensesRange: '',
  businessLicensesDate: '',
  businessLicensesStateser: '',
  //联系人信息字段
  contactPersonsId: 0,
  contactPersonsName: "",
  contactPersonsTell: "",
  position: "",
  contactPersonStatus: "",
  //银行信息字段
  banksId: 0,
  banksNo: '',
  branchNo: '',
  banksAccount:'',
  bankStatus: '',
});

//表单验证
const rules = reactive<FormRules<RuleForm>>({
  contactPersonsName: [
    { required: true, message: "请输入联系人", trigger: "blur" },
  ],
  contactPersonsTell: [
    { required: true, message: "请输入联系电话", trigger: "blur" },
  ],
  position: [{ required: true, message: "请输入联系人岗位", trigger: "blur" }],
  banksNo: [
    { required: true, message: '请选择银行编码', trigger: 'blur' },
  ],
  branchNo: [
    { required: true, message: '请输入分行名称', trigger: 'blur' },
  ],
  banksAccount: [
    { required: true, message: '请输入银行账户', trigger: 'blur' },
  ],
  businessLicenseNo: [
    { required: true, message: '请输入营业执照', trigger: 'blur' }
  ],
  representative: [
    { required: true, message: '请输入法人代表', trigger: 'blur' }
  ],
  enterpriseTypeId: [
    { required: true, message: '请输入公司类型', trigger: 'blur' }
  ],
  businessLicensesDate: [
    { required: true, message: '请选择成立时间', trigger: 'blur' }
  ],
});


const form = reactive({
  suppliersId:'',
  suppliersNo:'',
  suppliersName:'',
  suppliersType:'',
  suppliersPhone:'',
  suppliersAdder:'',
  countryId:'',
  cityId:'',
  supplierClassification:'',
  supplierLabels:'',
  companyLogo:'',
  outsideLabel:'',
  suppliersStatus:'',
})

//供应商管理修改
const UpdateSuppliers=()=>{
  axios.put(apiurl+'/api/ProducManagement/UpdateSupplier',{
    suppliersId:route.query.suppliersId,
    suppliersNo:form.suppliersNo,
    suppliersName:form.suppliersName,
    suppliersType:form.suppliersType,
    suppliersPhone:form.suppliersPhone,
    suppliersAdder:form.suppliersAdder,
    countryId:form.countryId,
    cityId:form.cityId,
    supplierClassification:form.supplierClassification,
    supplierLabels:form.supplierLabels,
    companyLogo:form.companyLogo,
    outsideLabel:form.outsideLabel,
    suppliersStatus:form.suppliersStatus,
  }).then((res)=>{
      console.log(res)
      ElMessage.success('修改成功')
  })
}


console.log(route.query.suppliersId)


//定义数组 存储联系人数据
const AddContactPersonList = ref([]);
//联系人显示
const GetData = () => {
  axios
    .post(apiurl1 + "/api/ShowProducManagement/ShowContactPersons", {
      suppliersId: route.query.suppliersId,
    })
    .then((res) => {
      console.log(res);
      AddContactPersonList.value = res.data.data
    })
    .catch((err) => {
      console.log(err);
    });
};

//联系人信息反填
const Fan = (contactPersonsId: any) => {
  dialogFormVisible1.value = true;
  axios
    .post(apiurl1 + "/api/ShowProducManagement/ContactPersonsSelById", {
      contactPersonsId: contactPersonsId,
    })
    .then((res) => {
      console.log(res.data);
      ruleForm.contactPersonsName = res.data.data[0].contactPersonsName;
      ruleForm.contactPersonsTell = res.data.data[0].contactPersonsTell;
      ruleForm.position = res.data.data[0].position;
      ruleForm.contactPersonStatus = res.data.data[0].contactPersonStatus;
      ruleForm.contactPersonsId = res.data.data[0].contactPersonsId;
    })
    .catch((err) => {
      console.log(err);
    });
};

//联系人修改
const UpdateContactPerson = () => {
  const data = {
    contactPersonsId: ruleForm.contactPersonsId,
    contactPersonsName: ruleForm.contactPersonsName,
    contactPersonsTell: ruleForm.contactPersonsTell,
    position: ruleForm.position,
    contactPersonStatus: ruleForm.contactPersonStatus,
  }
  console.log(data,1000);
  axios.put(apiurl + "/api/ProducManagement/UpdateContactPersons",data).then((res) => {
    console.log(res.data);
    dialogFormVisible1.value = false;
    GetData();
  });
};
//联系人删除
const ContactPersonDel = (contactPersonsId: any) => {
  ElMessageBox.confirm("确定要删除么?", "警告", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      axios
        .post(apiurl + "/api/ProducManagement/DelContactPersons", {
          contactPersonsId: contactPersonsId,
        })
        .then((res) => {
          console.log(res);
          ElMessage.success("删除成功");
          GetData();
        });
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "删除失败",
      });
    });
};



//定义一个数组存储银行信息
const BankAddList:any=ref([])
//银行显示
const GetBankData=()=>{
axios.post(apiurl1+'/api/ShowProducManagement/ShowBanks',{
  suppliersId:route.query.suppliersId,
})
.then((res)=>{
console.log(res)
BankAddList.value=res.data.data
})
.catch((err)=>{
console.log(err)
})
}

//银行传值
const BankFan=(banksId:any)=>{
  dialogFormVisible3.value=true
  axios.post(apiurl1+'/api/ShowProducManagement/BanksSelById',{
    banksId:banksId
})
.then((res)=>{
      console.log(res.data)
      ruleForm.banksId=res.data.data[0].banksId
      ruleForm.banksNo=res.data.data[0].banksNo
      ruleForm.branchNo=res.data.data[0].branchNo
      ruleForm.banksAccount=res.data.data[0].banksAccount
      ruleForm.bankStatus=res.data.data[0].bankStatus
  })
  .catch((err)=>{
      console.log(err)
  })
}

//银行修改
const UpdateBank=()=>{
  axios.put(apiurl+'/api/ProducManagement/UpdateBanks',{
    banksId:ruleForm.banksId,
    banksNo:ruleForm.banksNo,
    branchNo:ruleForm.branchNo,
    banksAccount:ruleForm.banksAccount,
    bankStatus:ruleForm.bankStatus,
  })
     .then(res=>{
      console.log(res)
     
      dialogFormVisible3.value = false
      GetBankData();
     }
    )
}
//银行删除
const BankDel=(banksId:any)=>{
  ElMessageBox.confirm(
    '确定要删除么?',
    '警告',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      axios.post(apiurl+'/api/ProducManagement/DelBanks',{
        banksId:banksId
      })
      .then(res=>{
        console.log(res)
        ElMessage.success('删除成功')
        GetBankData();
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '删除失败',
      })
    })
}



//钩子
onMounted(()=>{
  
axios.post(apiurl1+'/api/ShowProducManagement/SuppilerSelById',{
  suppliersId:route.query.suppliersId
})
.then((res)=>{
      console.log(res.data)
     form.suppliersNo=res.data.data[0].suppliersNo
     form.suppliersName=res.data.data[0].suppliersName
     form.suppliersType=res.data.data[0].suppliersType
     form.suppliersPhone=res.data.data[0].suppliersPhone
     form.suppliersAdder=res.data.data[0].suppliersAdder
     form.countryId=res.data.data[0].countryId
     form.cityId=res.data.data[0].cityId
     form.supplierClassification=res.data.data[0].supplierClassification
     form.supplierLabels=res.data.data[0].supplierLabels
     form.companyLogo=res.data.data[0].companyLogo
     form.outsideLabel=res.data.data[0].outsideLabel
     form.suppliersStatus=res.data.data[0].suppliersStatus
  })
  .catch((err)=>{
      console.log(err)
  })
  GetData();
  GetBankData()
})
</script>